document.addEventListener("DOMContentLoaded", function() {
    let currentIndex = 0; // 当前轮播图的索引
    const slides = document.querySelectorAll(".banner-box .bd li"); // 所有轮播图的列表
    const totalSlides = slides.length; // 轮播图的总数
    let slideInterval = setInterval(nextSlide, 3000); // 自动切换到下一张轮播图
  
    // 显示指定索引的轮播图，并重置其他轮播图的显示
    function showSlide(index) {
      slides.forEach((slide, i) => {
        slide.style.display = i === index ? 'block' : 'none';
      });
      currentIndex = index;
    }
  
    // 切换到下一张轮播图
    function nextSlide() {
      let nextIndex = (currentIndex + 1) % totalSlides;
      showSlide(nextIndex);
    }
  
    // 切换到上一张轮播图
    function prevSlide() {
      let prevIndex = (currentIndex - 1 + totalSlides) % totalSlides;
      showSlide(prevIndex);
    }
  
    // 为轮播图按钮添加点击事件
    const prevButton = document.querySelector(".banner-btn.prev");
    const nextButton = document.querySelector(".banner-btn.next");
  
    prevButton.addEventListener("click", function() {
      prevSlide();
      clearInterval(slideInterval); // 清除定时器
      slideInterval = setInterval(nextSlide, 3000); // 重新设置定时器
    });
  
    nextButton.addEventListener("click", function() {
      nextSlide();
      clearInterval(slideInterval); // 清除定时器
      slideInterval = setInterval(nextSlide, 3000); // 重新设置定时器
    });
  
    // 鼠标悬停在轮播图上时停止自动播放，移开时继续
    const bannerBox = document.querySelector(".banner-box");
    bannerBox.addEventListener("mouseover", function() {
      clearInterval(slideInterval);
    });
  
    bannerBox.addEventListener("mouseout", function() {
      slideInterval = setInterval(nextSlide, 3000);
    });
  });